<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />

    <link
            rel="stylesheet"
            href="https://cdn.jsdelivr.net/npm/vant@2.12/lib/index.css"
    />

    <!-- 引入 Vue 和 Vant 的 JS 文件 -->
    <script src="https://cdn.jsdelivr.net/npm/vue@2.6/dist/vue.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/vant@2.12/lib/vant.min.js"></script>

    <!-- 引入样式 -->
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@nutui/nutui@next/dist/style.css" />
    <!-- 引入Vue -->
    <script src="https://cdn.jsdelivr.net/npm/vue@next"></script>
    <!-- 引入NutUI组件库 -->
    <script src="https://cdn.jsdelivr.net/npm/@nutui/nutui@next/dist/nutui.umd.js"></script>

    <script src="https://cdn.jsdelivr.net/npm/darkmode-js@1.5.5/lib/darkmode-js.min.js"></script>
    <script src="js/jquery-1.12.4.min.js"></script>
</head>
<body>
<div id="app" style="width: 100% ;border: blue solid 1px" >

</div>
<script>

    // 在 #app 标签下渲染一个按钮组件
    const app = Vue.createApp({
        template: `

<!--        <nut-divider content-position="right">文本</nut-divider>-->
 <nut-navbar @on-click-back="back" @on-click-title="title" @on-click-clear="clear"  title="新建帖子" desc="发布"></nut-navbar>
        <div style="height: 400px ;width: 100% ;border: black solid 1px" >
             <nut-textarea v-model="value" rows="16" placeholder="分享新鲜事儿..."/>
        </nut-drag>
        <nut-uploader :url="uploadUrl" v-model:file-list="defaultFileList" maximum="20" multiple></nut-uploader>
        </div>
        `,
        data(){
         return{
             value:'',
             defaultFileList: [],


         }
        },
        methods:{

            back(){
                location.href='index.html';
            },
            clear(){

                   $.ajax({
                       url:"api/fabu",
                       data:{
                           texts:this.value,
                       },
                       type: 'get',
                       dataType: 'json',
                       beforeSend: function (xhr) {
                           // 方法二：使用请求头的方式传递
                           xhr.setRequestHeader("Authorization", localStorage.getItem("token"))
                       },
                       success: function (res) {

                           vant.Toast('发布成功');
                          setTimeout(function (){
                              location.href="index.html";
                          },1500)

                       }
                   });
               },
            }


    });
    app.use(nutui);
    app.mount("#app");

</script>
<script>

        let options = {
        bottom: "32px", // 定位底部距离 - 默认: '32px'
        right: "32px", // 定位右边距离 - 默认: '32px'
        left: "unset", // 定位左边距离 - 默认: 'unset'
        time: "0.5s", // 默认动画时间: '0.3s'
        mixColor: "#fff", // 需要改变的颜色 - 默认: '#fff'
        backgroundColor: "#fff", // 背景颜色 - 默认: '#fff'
        buttonColorDark: "#262728", // 黑暗模式下按钮颜色 - 默认: '#100f2c'
        buttonColorLight: "#fff", // 日间模式下按钮颜色 - 默认: '#fff'
        saveInCookies: true, // 是否在cookie保存当前模式 - 默认: true,
        label: "🌓", // 切换模式按钮图标 - 默认: ''
        autoMatchOsTheme: true // 是否自动根据系统适应模式 - 默认: true
    };

        let darkmode = new Darkmode(options);
        darkmode.showWidget();

</script>
</body>
</html>
